<template>
  <view>
    <!-- #ifdef APP-PLUS || MP-WEIXIN -->
    <u-navbar title="设置" back-icon-color="#000" :is-back="true" title-color="#000"
              :background="{ background:'#ffffff'}" :border-bottom="true"></u-navbar>
    <!-- #endif -->

    <u-cell-group :border="false">
      <u-cell-item title="用户昵称" :arrow="false" @click="ToPages" index="1">
        <view slot="icon"></view>
        <view slot="right-icon">
          <view class="wx_info" v-if="userData.nickname">
            <image class="my_wx_cion" :src="userData.avatar"></image>{{userData.nickname}}
          </view>
          <view class="wx_info" v-else>
            ID:{{userData.id}}
          </view>
        </view>
      </u-cell-item>
      <u-cell-item title="手机号" :arrow="true" :value="userData.username || '去绑定'" @click="ToPages" index="2">
        <view slot="icon"></view>
      </u-cell-item>
      <u-cell-item title="取款密码" arrow value="修改取款密码" @click="ToPages" index="3"></u-cell-item>
      <u-cell-item title="绑定微信" arrow @click="ToPages" index="4">
        <text v-if="isBindWechat">已绑定</text>
        <u-icon v-else name="weixin-fill" color="#9cda62" size="40"></u-icon>
      </u-cell-item>
      <u-cell-item title="登录密码" arrow value="修改登录密码" @click="ToPages" index="5"></u-cell-item>
      <u-cell-item title="隐私政策" arrow @click="ToPages" index="9">
        <view slot="icon"></view>
      </u-cell-item>
      <u-cell-item title="用户协议" arrow @click="ToPages" index="10">
        <view slot="icon"></view>
      </u-cell-item>
    </u-cell-group>
    <view class="lijipay">
      <u-button type="info" :hair-line="false" hover-class="none" shape="circle" :ripple="false" @click="TuiChu">退出登录</u-button>
    </view>


    <!--微信绑定弹窗-->
    <u-popup v-model="wechatShow" mode="center" :mask-close-able="false" width="80%" height="500rpx" border-radius="30">
      <view class="wechat-pop-box">
        <view class="wechat-pop-box-icon">
          <u-icon name="weixin-fill" color="#9cda62" size="100"></u-icon>
        </view>
        <view class="wechat-pop-box-title">绑定微信</view>
        <view class="wechat-pop-box-subtitle">提现到微信更安全</view>
        <view class="wechat-pop-box-btn">
          <u-button type="info" :hair-line="false"  shape="circle" :ripple="false" @click="wechatShow = false" style="width: 50%;padding: 0 20rpx">取消</u-button>
          <u-button type="success" :hair-line="false"  shape="circle" :ripple="false" @click="bindWechatClick" style="width: 50%;padding: 0 20rpx">确定</u-button>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
export default {
  data() {
    return {
      userData: {}, //用户信息
      wechatShow: false, //微信绑定弹窗
      isBindWechat: false, //是否绑定微信
    };
  },
  onShow() {
    let that = this
    let userInfo = uni.getStorageSync('userinfo')
    console.log('用户信息', userInfo)
    that.userData = userInfo
    if (userInfo.applet_openid){
      that.isBindWechat = true //显示绑定微信显示-已绑定
    }
  },
  methods: {
    ToPages(e) {
      let that = this
      console.log(e)
      if (e == 1) { //用户名称
        //uni.navigateTo({
        //	url: '/pages/me/BasicSettings/ChangebindingWeChat'
        //})
      } else if (e == 2) { //手机号
        if (!this.userData.username || this.userData.username == '') {
          uni.navigateTo({
            url: '/subPackagePurse/account-settings/ChangebindingPhone',
            animationType: 'pop-in'
          })
        } else {
          uni.navigateTo({
            url: '/subPackagePurse/account-settings/ChangebindingPhone'
          })
        }
      } else if (e == 3) { //取款密码
        console.log('取款密码', e)
        uni.navigateTo({
          url: '/subPackagePurse/account-settings/setPassword?type=' + e,
          animationType: 'pop-in'
        })
      } else if (e == 4) { //绑定微信
        let userInfo = uni.getStorageSync('userinfo')
        if (userInfo.applet_openid == ''){
          that.wechatShow = true
        }else{
          that.isBindWechat = true //显示绑定微信显示-已绑定
          uni.showToast({
              title: '您已绑定微信，请勿重新绑定',
              icon: 'none',
              duration: 2000
          });
        }
      }  else if (e == 5) { //登录密码
        uni.navigateTo({
          url: '/subPackagePurse/account-settings/setPassword?type=' + e,
          animationType: 'pop-in'
        })
      }else if (e == 9) { //隐私政策
        uni.navigateTo({
          url: '/subPackagePurse/account-settings/privacy-policy',
          animationType: 'pop-in'
        })
      } else if (e == 10) { //用户协议
        uni.navigateTo({
          url: '/subPackagePurse/account-settings/user-agreement',
          animationType: 'pop-in'
        })
      } else if (e == 7) {
        /*//支付宝账号和密码同时未设置时，优先提示设置提现账户
        if (this.alipayInfo.alipay_number == '') {
          uni.showToast({
            title: '请先设置提现账号',
            icon: 'none',
            duration: 2000
          })
        } else {
          uni.navigateTo({
            url: '/mePages/pages/BasicSettings/tixianpassword/Stepone',
            animationType: 'pop-in'
          })
        }*/
      }
      /*else if (e == 8) {
        uni.navigateTo({
          url: '/mePages/pages/BasicSettings/reviseLogonpass',
          animationType: 'pop-in'
        })
      } else if (e == 9) {
        this.zhuxiaoshow = true
      }*/
    },
    //绑定微信
    bindWechatClick() {
      let that = this
      if (uni.getStorageSync('userinfo').unionid == ''){
        uni.login({
          provider: 'weixin',
          success: function (login_res) {
            console.log('获取小程序code', login_res.code);
            that.$api.GetBindWechatAPI({
              code: login_res.code, //	是	string	登录授权code
            }).then(res => {
              console.log('微信小程序登录', res)
              if (res.data.status == 1){
                uni.showToast({
                  title: '微信绑定成功',
                  icon: 'none',
                  duration: 2000
                });
                setTimeout(() => {
                  that.isBindWechat = true //绑定微信显示-已绑定
                  that.wechatShow = false //关闭绑定弹窗
                }, 2000)
              }else {
                console.log('微信绑定失败', res.msg)
                that.wechatShow = false //关闭绑定弹窗
                uni.showToast({
                  title: res.msg,
                  icon: 'none',
                  duration: 2000
                });
               }
            }).catch(err => {
              console.log('获取小程序err', err.msg);
              that.wechatShow = false //关闭绑定弹窗
              uni.showToast({
                title: err.msg,
                icon: 'none',
                duration: 2000
              });
            });

          },
          fail: function (err) {
            console.log('调用失败!', err)
            that.Payloading = false
          }
        });
      }
    },
    //退出登录
    TuiChu(){
      uni.showModal({
        title: '提示',
        content: '你要退出登录吗?',
        success: function(res) {
          if (res.confirm) {
            console.log('用户点击确定');
            uni.clearStorageSync();
            uni.removeStorageSync('userinfo');
            uni.removeStorageSync('token');
            uni.reLaunch({
              url: '/pages/logon/logon'
            });
          } else if (res.cancel) {
            console.log('用户点击取消');
          }
        }
      });
    },
    // 分享至好友/群聊
    onShareAppMessage(res) {
      const userInfo = JSON.parse(uni.getStorageSync('userinfo') || '{}')
      console.log('用户信息', userInfo)
      return {
        title: '欢迎使用小程序',
        path: 'pages/index/index?shareId=' + userInfo.id,
        imageUrl: '/static/images/share.png'
      }

    },
    // 分享至朋友圈
    onShareTimeline() {},
  }
}
</script>

<style lang="scss">
.wx_info {
  display: flex;
  align-items: center;

  .my_wx_cion {
    width: 50rpx;
    height: 50rpx;
    margin-right: 20rpx;
    border-radius: 200rpx;
  }
}

.lijipay {
  position: fixed;
  bottom: 3%;
  width: 92%;
  margin: 0 auto;
  left: 0;
  right: 0;
  .u-size-default {
    height: 80rpx !important;
    line-height: 80rpx !important;
    background-image: linear-gradient(to right, #f7f7f7, #f7f7f7) !important;
    color: #333333;
  }
}

//绑定微信css
.wechat-pop-box {
  height: 100%;
  padding: 30rpx;
  position: relative;
  .wechat-pop-box-icon {
    text-align: center;
    margin-bottom: 30rpx;
  }
  .wechat-pop-box-title{
    line-height: 50rpx;
    text-align: center;
    font-size: 36rpx;
    margin-bottom: 40rpx;
    color: #3D3D3D;
  }
  .wechat-pop-box-subtitle {
    line-height: 40rpx;
    text-align: center;
    font-size: 28rpx;
    margin-bottom: 30rpx;
    color: #666666;
  }
  .wechat-pop-box-btn {
    display: flex;
    justify-content: space-between;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20rpx 0;
  }
}
</style>
